function Snake(ele) {
    this.ele = ele

    this.foodObj = new Food(ele)

    this.fangxiang = 'you'

    this.snakeObj = [
        // {x:3,y:3,color:'red',ele:null},
        // {x:2,y:3,color:'blue',ele:null},
        // {x:1,y:3,color:'blue',ele:null}
        {
            x: 3,
            y: 3,
            color: 'red'
        },
        {
            x: 2,
            y: 3,
            color: 'blue'
        },
        {
            x: 1,
            y: 3,
            color: 'blue'
        }
    ]
    this.length = 20

 
    this.int()

}

Snake.prototype.int=function(){
    let startObj=document.querySelector('.start')
    // console.log(startObj);
    startObj.onclick=()=>{
        this.dong()
    }
    let stopObj=document.querySelector('.stop')
    stopObj.onclick=()=>{
        clearInterval(t)
    }
}

Snake.prototype.dong = function () {
    t = setInterval(() => {
        this.move()
        this.eat()
        this.foodObj.creat()
    }, 200)
    // console.log(t);
}
Snake.prototype.creat = function () {
    for (let i = 0; i < this.snakeObj.length; i++) {
        let divObj = document.createElement('div')
        divObj.style.width = this.length + 'px'
        divObj.style.height = this.length + 'px'
        divObj.style.position = 'absolute'
        divObj.style.left = (this.snakeObj[i].x) * this.length
        divObj.style.top = (this.snakeObj[i].y) * this.length
        divObj.style.background = this.snakeObj[i].color
        divObj.className = 'she'
        // this.snakeObj[i].ele = divObj
        this.ele.appendChild(divObj)
        // console.log(divObj);
        // console.log(this.snakeObj[i]);
    }
}


Snake.prototype.remove = function () {
    let div = this.ele.querySelectorAll('.she')
    div.forEach((item) => {
        this.ele.removeChild(item)
    })
}

Snake.prototype.move = function () {
    // this.eat()
    this.remove()
    document.addEventListener('keydown', (evt) => {
        let e = evt || window.event
        switch (e.keyCode) {
            // wasd  87 83 65 68  上下左右38 40 37 39
            // case (87 || 38):
            case 38:
                this.fangxiang = 'shang'
                break;
            case 40:
                this.fangxiang = 'xia'
                break;
            case 37:
                this.fangxiang = 'zuo'
                break;
            case 39:
                this.fangxiang = 'you'
                break;
            default:
                break;
                console.log(this.fangxiang);
        }
    })
    for (let i = this.snakeObj.length - 1; i > 0; i--) {
        // console.log(this.snakeObj[i])
        this.snakeObj[i].x = this.snakeObj[i - 1].x
        this.snakeObj[i].y = this.snakeObj[i - 1].y
    }
    switch (this.fangxiang) {
        case 'shang':
            this.snakeObj[0].y -= 1
            break;
        case 'xia':
            this.snakeObj[0].y += 1
            break;
        case 'zuo':
            this.snakeObj[0].x -= 1
            break;
        case 'you':
            this.snakeObj[0].x += 1
            break;
        default:
            break;
    }

    this.creat()


}


Snake.prototype.eat = function () {
    let food = this.ele.querySelector('.food')
    let shex = this.snakeObj[0].x * 20
    let shey = this.snakeObj[0].y * 20
    // console.log(food.offsetLeft,shex,food.offsetTop,shey);
    // console.log(document.querySelector('.food'));

    
    if ((food.offsetLeft === shex) && (food.offsetTop === shey)) {
        // console.log(1111);
        // console.log(food.offsetLeft);
        let foods = this.ele.querySelector('.food')
        this.ele.removeChild(foods)
        this.snakeObj.push({
            x: this.snakeObj[this.snakeObj.length - 1].x - 1,
            y: this.snakeObj[this.snakeObj.length - 1].y,
            color: 'blue',
        })
    }
    if ((shex < 0) || (shex > 780) || (shey < 0)||(shey > 380)) {
        clearInterval(t)
        // console.log(t);
        alert('游戏结束')
    }

}